import React from 'react';
import { Animated, Easing } from 'react-native';

class Pulse extends React.Component {
  constructor(props) {
    super(props);
    this.state = {
      scaleValue: new Animated.Value(1)
    };
  }

  componentDidMount() {
    this.animate();
  }

  animate = () => {
    Animated.sequence([
      Animated.timing(this.state.scaleValue, {
        toValue: 1.1,
        duration: 300,
        easing: Easing.linear,
        useNativeDriver: true
      }),
      Animated.timing(this.state.scaleValue, {
        toValue: 1,
        duration: 300,
        easing: Easing.linear,
        useNativeDriver: true
      })
    ]).start(() => this.animate());
  }

  render() {
    return (
      <Animated.View style={{ transform: [{ scale: this.state.scaleValue }] }}>
        {this.props.children}
      </Animated.View>
    );
  }
}

export default Pulse;